import * as THREE from 'three'
import createApp from '../../core'
import TWEEN from '@tweenjs/tween.js'

function createTween01 (dom: HTMLElement) {
  const { camera, scene, update } = createApp(dom)
  camera.position.set(100, 80, 100)
  camera.lookAt(scene.position)

  const axes = new THREE.AxesHelper(100)
  scene.add(axes)

  const boxGeo = new THREE.BoxGeometry(10, 10, 10)
  const material = new THREE.MeshNormalMaterial()
  const mesh = new THREE.Mesh(boxGeo, material)
  mesh.position.set(-100, 0, 0)
  scene.add(mesh)

  const initState = {
    x: -100
  }
  new TWEEN.Tween(initState)
    .to({ x: 100 }, 1000)
    .easing(TWEEN.Easing.Linear.None)
    .onUpdate((state: any) => {
      mesh.position.x = state.x
    })
    .repeat(Infinity)
    .yoyo(true)
    .start()
  console.log(TWEEN.getAll())
  update(() => {
    TWEEN.update()
  })
}

export {
  createTween01
}
